<template>
  <!-- 首页 -->
  <view>
    <view class="MyWork">
      <view class="title">
        <view text="我的工作"></view>
        <!-- <text @click="skipUrl">历史记录</text> -->
      </view>
      <view class="card">
        <view class="left">
          <view>正在工作中</view>
          <view>
            <text>校宇通</text>
            <text>企大咖</text>
          </view>
        </view>
        <view class="right">
          <view>待入工作</view>
          <view>
            <text>煮酒小程序需求沟通</text>
          </view>
        </view>
      </view>
    </view>
    <view class="TodayWork">
      <view class="title">
        <view text="今日工作"></view>
      </view>
      <view class="workList">
        <view class="work">
          <view class="workName">
            <view class="icon">
              <view></view>
            </view>
            <view class="name">企大咖项目需求沟通会议</view>
          </view>
          <view class="workinfo">
            <view class="workTime">09:30-10:00</view>
            <view class="place">地点：103会议室</view>
          </view>
        </view>
        <view class="work">
          <view class="workName">
            <view class="icon">
              <view></view>
            </view>
            <view class="name">校宇通bug修复</view>
          </view>
          <view class="workinfo">
            <view class="workTime">10:00-6:30</view>
            <view class="place">地点：工位</view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
    }
  },
  methods: {
  },
}
</script>

<style scoped lang='less'>
.MyWork {
  margin-top: 100rpx;
  padding: 20rpx 35rpx;

  .title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 28rpx;
    margin-top: 50rpx;

    text {
      font-size: 24rpx;
      font-weight: 400;
      color: #F77221;
      line-height: 44rpx;
    }
  }

  .card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4rpx;

    .left,
    .right {
      flex: 1;
      background: linear-gradient(-84deg, #F7701F 1%, #FACF5B 100%);
      box-shadow: 0rpx 4rpx 5rpx 0rpx rgba(247, 115, 33, 0.52);
      border-radius: 16rpx;
      margin-right: 30rpx;
      width: 137rpx;
      font-size: 28rpx;
      font-weight: 400;
      color: #FFFFFF;
      line-height: 44rpx;
      padding: 30rpx 28rpx;

      text {
        font-size: 22rpx;
        font-weight: 400;
        color: #FFFFFF;
        line-height: 44rpx;
        margin-right: 40rpx;
      }
    }

    .right {
      background: linear-gradient(-84deg, #E12D47 1%, #FA717F 98%);
      box-shadow: 0rpx 4rpx 5rpx 0rpx rgba(247, 115, 33, 0.52);
      border-radius: 16rpx;
      margin-left: 30rpx;
      margin-right: 0;
    }
  }
}

.TodayWork {
  margin: 26rpx;
  background: #FFFFFF;
  box-shadow: 0rpx 6rpx 10rpx 0rpx rgba(0, 0, 0, 0.02);
  border-radius: 15rpx;
  padding: 30rpx 28rpx;

  .title {
    display: flex;
    align-items: center;
    justify-content: space-between;

    text {
      font-size: 24rpx;
      font-weight: 400;
      color: #F77221;
      line-height: 44rpx;
    }
  }

  .workList {
    .work {
      .workName {
        display: flex;
        font-size: 26rpx;
        font-weight: 400;
        color: #2F2F2F;
        margin-top: 40rpx;
        margin-bottom: 22rpx;

        .icon {
          width: 34rpx;
          margin-right: 10rpx;

          view {
            width: 14rpx;
            height: 14rpx;
            border: 4px solid #ED6F1A;
            border-radius: 50%;
          }
        }
      }



      .workinfo {
        margin-left: 44rpx;

        .workTime {
          font-size: 26rpx;
          font-weight: 400;
          color: #737373;
          margin-bottom: 19rpx;

        }

        .place {
          font-size: 24rpx;
          font-weight: 400;
          color: #8D8D8D;
        }
      }
    }
  }
}
</style>
